<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="cache-control" content="no-cache" />
        <meta http-equiv="pragma" content="no-cache" />  
        <title><?=INSTANCE_NAME?> Admin</title>
        
        <!-- CSS -->
        <link href="<?=base_url()?>assets/admin/css/admin_styles<?=INSTANCE_FILE_SUFFIX?>.css" rel="stylesheet" type="text/css" media="screen" >
        <link href="<?=base_url()?>assets/admin/css/jquery-ui.custom.css" rel="stylesheet" type="text/css" media="screen" >


        <!-- JAVASCRIPT -->
        <script type="text/javascript" src="<?=base_url()?>assets/admin/js/jquery-1.4.1.min.js"></script>                            
        <script type="text/javascript" src="<?=base_url()?>assets/admin/js/jquery.tools.min.js"></script>
        <script type="text/javascript" src="<?=base_url()?>assets/admin/js/jquery.ui.core.js"></script>                            
        <script type="text/javascript" src="<?=base_url()?>assets/admin/js/jquery.ui.datepicker.js"></script>                            
        <script type="text/javascript" src="<?=base_url()?>assets/admin/tiny_mce/tiny_mce.js"></script>
        <script type="text/javascript" src="<?=base_url()?>assets/admin/tiny_mce/plugins/imagemanager/js/mcimagemanager.js"></script>

        
        <script type="text/javascript">

        tinyMCE.init({

                theme : "advanced",
                mode : "specific_textareas",
                editor_selector : "tinymceEditor_force_paragraph",
                plugins : "autoresize,paste",
                theme_advanced_buttons1 : "bold,italic,|,undo,redo,|,removeformat,paste,pastetext,|,link,unlink,bullist,|,code",
                theme_advanced_buttons2 : "",
                theme_advanced_buttons3 : "",
                theme_advanced_resizing : true,
                theme_advanced_toolbar_align : "left",
                theme_advanced_toolbar_location : "top",
                theme_advanced_statusbar_location : "bottom",
                onchange_callback : "triggerTinyChangeEvent",
                convert_urls : false,
                cleanup_on_startup : true,
                cleanup : true,
                valid_elements : "a[href|title|target],br,p,strong,bold,i,em,ul,li",
                forced_root_block : "p",     
                   entity_encoding : 'raw',
                   force_p_newlines : true,
                paste_auto_cleanup_on_paste : true

        });
               
        function triggerTinyChangeEvent(inst) {
            $(".tinymceEditor:first").change(); //trigger change event for textarea 
        }  
        
        $(function() { 

            // VIEW - opens trigger's href in overlay
            $("a[rel=view]").click(function(){
                url = $(this).attr("href");
                $("#overlay").overlay({  
                    expose: '#666',    
                    top:'10%',        
                    onBeforeLoad: function() { 
                        var wrap = this.getContent().find(".overlay_container"); 
                        wrap.html("Loading...");
                        wrap.load(url); 
                    }, 
                    api: true 
                }).load(); 
                return false;
            });

            // PREVIEW - sends form data to trigger's href and displays response in overlay
            $("a[rel=preview]").click(function(){  
                url = $(this).attr("href");              
                tinyMCE.triggerSave();
                post_data = $(this).parents("form").serialize().replace(/%5B%5D/g, '[]');
                $("#overlay").overlay({ 
                    expose: '#666',   
                    top:'10%',
                    onBeforeLoad: function() { 
                        var wrap = this.getContent().find(".overlay_container"); 
                        wrap.html("Loading...");
                        $.post(url,post_data,
                            function(data) {
                                wrap.html(data);  
                            },"html");
                    }, 
                    api: true  
                }).load();
                return false;
            })     

        });   

        // Datepicker
        $(function() {
            $(".datepicker").datepicker();
        });
           


        </script>                        

    </head>
    <body>

<!-- overlayed element --> 
<div class="overlay" id="overlay"> 
    <div class="overlay_container"></div>  
</div>